// js/pages/ProfilePage.js
import BasePage from './BasePage.js';
import TextRenderer from '../utils/TextRenderer.js';
import myFn from '../utils/myFn.js';

// 提取常量
const UI_CONSTANTS = {
  COLORS: {
    WHITE: '#ffffff',
    LIGHT_BLUE: '#B1D3FF',
    CYAN: '#45F6FF',
    MENU_SELECTED_START: '#935E2D',
    MENU_SELECTED_END: '#F1D48B',
    MENU_NORMAL_START: '#113258',
    MENU_NORMAL_END: '#014069',
    STATS_BACKGROUND: '#1A1B32',
    STATS_HEADER: '#373759'
  },
  SIZES: {
    MENU_WIDTH: 192,
    MENU_HEIGHT: 102,
    MENU_ITEM_HEIGHT: 102,
    AVATAR_SIZE: 160,
    LINE_HEIGHT: 68,
    POSTER_LINE_HEIGHT: 50
  },
  POSITIONS: {
    AVATAR: { X: 252, Y: 166, WIDTH: 160, HEIGHT: 160 },
    BACK_BUTTON: { X: 78, Y: 28, WIDTH: 28, HEIGHT: 42 },
    USERNAME: { X: 468, Y: 208 },
    USER_ID: { X: 468, Y: 288 },
    MENU: { X: 0, Y: 104 },
    STATS_PANEL: { X: 1024, Y: 106, WIDTH: 600, HEIGHT: 646 },
    STATS_HEADER: { X: 1066, Y: 115 },
    SAVE_BUTTON: { X: 1230, Y: 650, WIDTH: 239, HEIGHT: 88 },
    SAVE_BUTTON_TEXT: { X: 1276, Y: 680 },
    // 海报相关位置
    POSTER: {
      AVATAR: { X: 38, Y: 66, SIZE: 112 },
      USERNAME: { X: 170, Y: 88 },
      USER_ID: { X: 170, Y: 150 },
      STATS_TITLE: { X: 100, Y: 250 },
      ANALYSIS_TITLE: { X: 100, Y: 683 },
      STATS_START: { X: 104, Y: 320 },
      STATS_LABEL_X: 104,
      STATS_VALUE_X: 588,
      ANALYSIS_START: { X: 104, Y: 750 },
      ANALYSIS_COL1: 104,
      ANALYSIS_COL2: 314,
      ANALYSIS_COL3: 615,
      SUGGESTION: { X: 104, Y: 950 }
    }
  },
  FONT_SIZES: {
    USERNAME: 40,
    USER_ID: 32,
    MENU: 28,
    STATS_TITLE: 32,
    STATS_LABEL: 24,
    STATS_VALUE: 24,
    BUTTON: 32,
    POSTER_TITLE: 32,
    POSTER_TEXT: 24,
    POSTER_USERNAME: 28,
    POSTER_USER_ID: 24
  },
  STATS_ITEMS: [
    { label: '投资次数', key: 'investment_num' },
    { label: '盈利次数', key: 'profit_num' },
    { label: '亏损次数', key: 'loss_num' },
    { label: '平均收益（元）', key: 'avg_profit', format: true },
    { label: '平均亏损（元）', key: 'avg_loss', format: true },
    { label: '单笔最大收益（元）', key: 'max_profit', format: true },
    { label: '单笔最大亏损（元）', key: 'max_loss', format: true }
  ],
  // 海报分析项
  POSTER_ANALYSIS_ITEMS: [
    { label: '胜率', key: 'win_rate', suffix: '%' },
    { label: '盈亏比', key: 'profit_loss_ratio' }
  ],
  // 参考值
  REFERENCE_VALUES: {
    win_rate: '>50%',
    profit_loss_ratio: '>1.5'
  }
};

// 菜单配置
const MENU_ITEMS = [
  { text: '基本信息', index: 0, enabled: true },
  { text: '练习赛战绩', index: 1, enabled: true, message: '功能开发中' },
  { text: '挑战赛战绩', index: 2, enabled: false, message: '暂未开启挑战赛' }
];

export default class ProfilePage extends BasePage {
  constructor(canvas, ctx, pageManager, resourceManager, screenAdapter, api, userManager) {
    super(canvas, ctx, pageManager, resourceManager, screenAdapter);
    this.api = api;
    this.userManager = userManager;
    this.textRenderer = new TextRenderer(ctx, screenAdapter);

    // 页面状态
    this.pageState = {
      selectedMenuIndex: 0,
      isInitialized: false,
      isGeneratingPoster: false
    };

    // 菜单配置
    this.menuConfig = {
      x: UI_CONSTANTS.POSITIONS.MENU.X,
      y: UI_CONSTANTS.POSITIONS.MENU.Y,
      width: UI_CONSTANTS.SIZES.MENU_WIDTH,
      height: UI_CONSTANTS.SIZES.MENU_HEIGHT,
      items: MENU_ITEMS
    };

    // 用户数据
    this.userData = {
      userBattle: null
    };

    // 缓存用户数据避免重复获取
    this.cachedUserData = null;
  }

  onInit() {
    return Promise.resolve();
  }

  /**
   * 页面初始化方法
   */
  async initialize() {
    try {
      await this.initializeUI();
      await this.fetchGameData();
      this.pageState.isInitialized = true;
    } catch (error) {
      console.error('个人资料页面初始化失败:', error);
      myFn.showToast('初始化失败，请重试');
      throw error;
    }
  }

  /**
   * 初始化UI
   */
  async initializeUI() {
    // 预留UI初始化逻辑
  }

  /**
   * 获取游戏数据
   */
  async fetchGameData() {
    try {
      const response = await this.api.game.getstatistic();
      this.userData.userBattle = response.data;
    } catch (error) {
      console.error('获取用户统计数据失败:', error);
      myFn.showToast('获取数据失败，请重试');
      // 设置默认值避免渲染错误
      this.userData.userBattle = {};
    }
  }

  /**
   * 获取缓存的用户数据
   */
  getUserData() {
    if (!this.cachedUserData) {
      this.cachedUserData = this.userManager.getUserData();
    }
    return this.cachedUserData;
  }

  /**
   * 渲染页面
   */
  render() {
    if (!this.pageState.isInitialized) return;

    this.renderBackground();
    this.renderMenu();
    this.renderBackButton();

    // 根据选中的菜单渲染不同内容
    switch (this.pageState.selectedMenuIndex) {
      case 0:
        this.drawBasicUserInfo();
        break;
      case 1:
        this.renderUserInfo();
        this.renderStatsPanel();
        break;
      default:
        // 其他菜单项暂时不渲染内容
        break;
    }
  }

  /**
   * 渲染背景
   */
  renderBackground() {
    const userBg = this.resourceManager.getImage('userBg');
    if (userBg) {
      this.ctx.drawImage(userBg, 0, 0, this.screenAdapter.DESIGN_WIDTH, this.screenAdapter.DESIGN_HEIGHT);
    }
  }

  /**
   * 绘制基本用户信息（中间菜单）
   */
  drawBasicUserInfo() {
    const centerX = this.screenAdapter.DESIGN_WIDTH / 2;

    // 绘制用户头像
    this.drawAvatar(centerX - 105, 230, 210, 210, this.ctx);

    // 绘制右下角LOGO
    this.drawUserLogo();

    // 绘制用户信息
    const userData = this.getUserData();
    this.textRenderer.drawText(
      `ID: ${userData.ID}`,
      centerX,
      496,
      `${UI_CONSTANTS.FONT_SIZES.USER_ID}px ${this.textRenderer.systemFont}`,
      UI_CONSTANTS.COLORS.WHITE,
      'center',
      'top'
    );

    this.textRenderer.drawText(
      userData.user_name,
      centerX,
      560,
      `60px ${this.textRenderer.systemFont}`,
      UI_CONSTANTS.COLORS.WHITE,
      'center',
      'top'
    );
  }

  /**
   * 绘制头像
   */
  drawAvatar(x, y, width, height, ctx) {
    const avatar = this.resourceManager.getImage('defaultAvatar');
    if (avatar) {
      ctx.drawImage(avatar, x, y, width, height);
    }
  }

  /**
   * 绘制用户LOGO
   */
  drawUserLogo() {
    const userLogs = this.resourceManager.getImage('userLogs');
    if (userLogs) {
      this.ctx.drawImage(
        userLogs,
        this.screenAdapter.DESIGN_WIDTH - userLogs.width - 20,
        this.screenAdapter.DESIGN_HEIGHT - userLogs.height - 30,
        206,
        50
      );
    }
  }

  /**
   * 渲染用户信息（侧边菜单）
   */
  renderUserInfo() {
    this.renderAvatar();
    this.renderUserDetails();
  }

  /**
   * 渲染头像
   */
  renderAvatar() {
    const { X, Y, WIDTH, HEIGHT } = UI_CONSTANTS.POSITIONS.AVATAR;
    this.drawAvatar(X, Y, WIDTH, HEIGHT, this.ctx);
  }

  /**
   * 渲染返回按钮
   */
  renderBackButton() {
    const backIcon = this.resourceManager.getImage('backIcon');
    if (backIcon) {
      const { X, Y, WIDTH, HEIGHT } = UI_CONSTANTS.POSITIONS.BACK_BUTTON;
      this.ctx.drawImage(backIcon, X, Y, WIDTH, HEIGHT);
    }
  }

  /**
   * 渲染用户详细信息
   */
  renderUserDetails() {
    const userData = this.getUserData();
    const { USERNAME, USER_ID } = UI_CONSTANTS.POSITIONS;

    // 用户名
    this.textRenderer.drawText(
      userData.user_name,
      USERNAME.X,
      USERNAME.Y,
      `${UI_CONSTANTS.FONT_SIZES.USERNAME}px ${this.textRenderer.systemFont}`,
      UI_CONSTANTS.COLORS.WHITE,
      'left',
      'top'
    );

    // 用户ID
    this.textRenderer.drawText(
      `ID: ${userData.ID}`,
      USER_ID.X,
      USER_ID.Y,
      `${UI_CONSTANTS.FONT_SIZES.USER_ID}px ${this.textRenderer.systemFont}`,
      UI_CONSTANTS.COLORS.WHITE,
      'left',
      'top'
    );
  }

  /**
   * 渲染菜单
   */
  renderMenu() {
    this.menuConfig.items.forEach((item, index) => {
      const y = this.menuConfig.y + index * this.menuConfig.height;
      this.renderMenuItem(item, this.menuConfig.x, y, index === this.pageState.selectedMenuIndex);
    });
  }

  /**
   * 渲染菜单项
   */
  renderMenuItem(item, x, y, isSelected) {
    // 绘制背景
    this.renderMenuItemBackground(x, y, this.menuConfig.width, this.menuConfig.height, isSelected);

    // 绘制文本
    this.textRenderer.drawText(
      item.text,
      x + this.menuConfig.width / 2,
      y + this.menuConfig.height / 2 - 10,
      `bold ${UI_CONSTANTS.FONT_SIZES.MENU}px ${this.textRenderer.systemFont}`,
      UI_CONSTANTS.COLORS.WHITE,
      'center',
      'top'
    );
  }

  /**
   * 渲染菜单项背景
   */
  renderMenuItemBackground(x, y, width, height, isSelected) {
    const gradient = this.ctx.createLinearGradient(x, y, x + width, y + height);

    if (isSelected) {
      gradient.addColorStop(0, UI_CONSTANTS.COLORS.MENU_SELECTED_START);
      gradient.addColorStop(1, UI_CONSTANTS.COLORS.MENU_SELECTED_END);
    } else {
      gradient.addColorStop(0, UI_CONSTANTS.COLORS.MENU_NORMAL_START);
      gradient.addColorStop(1, UI_CONSTANTS.COLORS.MENU_NORMAL_END);
    }

    this.ctx.fillStyle = gradient;
    this.ctx.fillRect(x, y, width, height);
  }

  /**
   * 渲染统计面板
   */
  renderStatsPanel() {
    this.renderStatsBackground();
    this.renderStatsHeader();
    this.renderStatsItems();
    this.renderSaveButton();
  }

  /**
   * 渲染统计背景
   */
  renderStatsBackground() {
    const { X, Y, WIDTH, HEIGHT } = UI_CONSTANTS.POSITIONS.STATS_PANEL;

    // 主背景
    this.ctx.fillStyle = UI_CONSTANTS.COLORS.STATS_BACKGROUND;
    this.ctx.fillRect(X, Y, WIDTH, HEIGHT);

    // 头部背景
    this.ctx.fillStyle = UI_CONSTANTS.COLORS.STATS_HEADER;
    this.ctx.fillRect(X, Y, WIDTH, 44);
  }

  /**
   * 渲染统计头部
   */
  renderStatsHeader() {
    this.textRenderer.drawText(
      '统计',
      UI_CONSTANTS.POSITIONS.STATS_HEADER.X,
      UI_CONSTANTS.POSITIONS.STATS_HEADER.Y,
      `${UI_CONSTANTS.FONT_SIZES.STATS_TITLE}px ${this.textRenderer.systemFont}`,
      UI_CONSTANTS.COLORS.LIGHT_BLUE,
      'left',
      'top'
    );
  }

  /**
   * 渲染统计项
   */
  renderStatsItems() {
    if (!this.userData.userBattle) return;

    const { X, Y } = UI_CONSTANTS.POSITIONS.STATS_PANEL;
    const rightX1 = 1066;
    const rightX2 = 1600;
    const rightY = 205;

    UI_CONSTANTS.STATS_ITEMS.forEach((item, index) => {
      const y = rightY + index * UI_CONSTANTS.SIZES.LINE_HEIGHT;

      // 标签
      this.textRenderer.drawText(
        item.label,
        rightX1,
        y,
        `${UI_CONSTANTS.FONT_SIZES.STATS_LABEL}px ${this.textRenderer.systemFont}`,
        UI_CONSTANTS.COLORS.WHITE,
        'left',
        'center'
      );

      // 值
      let value = this.userData.userBattle[item.key];

      // 格式化数值
      if (item.format && value !== undefined && value !== null) {
        value = myFn.formatNumberManually(value);
      }

      this.textRenderer.drawText(
        value || '--',
        rightX2,
        y,
        `${UI_CONSTANTS.FONT_SIZES.STATS_VALUE}px ${this.textRenderer.systemFont}`,
        UI_CONSTANTS.COLORS.CYAN,
        'right',
        'center'
      );
    });
  }

  /**
   * 渲染保存按钮
   */
  renderSaveButton() {
    const { X, Y, WIDTH, HEIGHT } = UI_CONSTANTS.POSITIONS.SAVE_BUTTON;
    const { X: textX, Y: textY } = UI_CONSTANTS.POSITIONS.SAVE_BUTTON_TEXT;

    // 按钮图标
    const againIcon = this.resourceManager.getImage('againIcon');
    if (againIcon) {
      this.ctx.drawImage(againIcon, X, Y, WIDTH, HEIGHT);
    }

    // 按钮文本
    this.textRenderer.drawText(
      '保存图片',
      textX,
      textY,
      `${UI_CONSTANTS.FONT_SIZES.BUTTON}px ${this.textRenderer.systemFont}`,
      UI_CONSTANTS.COLORS.WHITE,
      'left',
      'top'
    );
  }

  /**
   * 处理触摸开始事件
   */
  handleTouchStart(event) {
    const touch = event.touches[0];
    const logicPoint = this.screenAdapter.screenToLogic(touch.clientX, touch.clientY);
    // 预留触摸开始处理逻辑
  }

  /**
   * 处理触摸结束事件
   */
  handleTouchEnd(event) {
    const touch = event.changedTouches[0];
    const logicPoint = this.screenAdapter.screenToLogic(touch.clientX, touch.clientY);

    // 处理按钮点击
    if (this.handleButtonClick(logicPoint)) {
      return;
    }

    // 处理菜单点击
    if (this.handleMenuClick(logicPoint)) {
      return;
    }
  }

  /**
   * 处理触摸移动事件
   */
  handleTouchMove(event) {
    // 预留触摸移动处理逻辑
  }

  /**
   * 处理按钮点击
   */
  handleButtonClick(point) {
    // 返回按钮
    if (this.isBackButtonClicked(point)) {
      this.pageManager.showPage('home');
      return true;
    }

    // 保存按钮
    if (this.isSaveButtonClicked(point)) {
      this.handleSaveButtonClick();
      return true;
    }

    return false;
  }

  /**
   * 处理菜单点击
   */
  handleMenuClick(point) {
    if (point.x < this.menuConfig.x || point.x > this.menuConfig.x + this.menuConfig.width) {
      return false;
    }

    for (let i = 0; i < this.menuConfig.items.length; i++) {
      const itemY = this.menuConfig.y + i * this.menuConfig.height;

      if (point.y >= itemY && point.y <= itemY + this.menuConfig.height) {
        const menuItem = this.menuConfig.items[i];

        if (menuItem.enabled) {
          this.pageState.selectedMenuIndex = menuItem.index;
        } else {
          myFn.showToast(menuItem.message || '功能暂未开放');
        }

        return true;
      }
    }

    return false;
  }

  /**
   * 检查返回按钮是否被点击
   */
  isBackButtonClicked(point) {
    const btn = UI_CONSTANTS.POSITIONS.BACK_BUTTON;
    return point.x >= btn.X && point.x <= btn.X + btn.WIDTH &&
      point.y >= btn.Y && point.y <= btn.Y + btn.HEIGHT;
  }

  /**
   * 检查保存按钮是否被点击
   */
  isSaveButtonClicked(point) {
    const btn = UI_CONSTANTS.POSITIONS.SAVE_BUTTON;
    return point.x >= btn.X && point.x <= btn.X + btn.WIDTH &&
      point.y >= btn.Y && point.y <= btn.Y + btn.HEIGHT;
  }

  /**
   * 处理保存按钮点击
   */
  handleSaveButtonClick() {
    if (this.pageState.isGeneratingPoster) {
      myFn.showToast('正在生成海报，请稍候');
      return;
    }

    this.pageState.isGeneratingPoster = true;
    wx.showLoading({ title: '海报生成中...' });

    try {
      this.generateAndRotatePoster();
    } catch (error) {
      this.handlePosterError(error);
    }
  }

  /**
   * 生成并旋转海报
   */
  generateAndRotatePoster() {
    // 创建源画布
    const sourceCanvas = wx.createCanvas({ type: '2d' });
    sourceCanvas.width = 750;
    sourceCanvas.height = 1624;
    const sourceCtx = sourceCanvas.getContext('2d');

    // 绘制海报内容
    this.drawPosterContent(sourceCtx, sourceCanvas.width, sourceCanvas.height, sourceCanvas);

    // 创建旋转后的画布
    const rotatedCanvas = wx.createCanvas({ type: '2d' });
    rotatedCanvas.width = 1624;
    rotatedCanvas.height = 750;
    const rotatedCtx = rotatedCanvas.getContext('2d');

    // 执行旋转
    rotatedCtx.translate(rotatedCanvas.width / 2, rotatedCanvas.height / 2);
    rotatedCtx.rotate(-Math.PI / 2);
    rotatedCtx.drawImage(
      sourceCanvas,
      -sourceCanvas.width / 2,
      -sourceCanvas.height / 2
    );

    // 导出图片
    rotatedCanvas.toTempFilePath({
      success: (res) => {
        this.handlePosterSuccess(res.tempFilePath);
      },
      fail: (err) => {
        this.handlePosterError(err);
      }
    });
  }

  /**
   * 处理海报生成成功
   */
  handlePosterSuccess(tempFilePath) {
    wx.hideLoading();
    this.pageState.isGeneratingPoster = false;
    this.pageManager.showPage('poster', tempFilePath);
  }

  /**
   * 处理海报生成错误
   */
  handlePosterError(error) {
    wx.hideLoading();
    this.pageState.isGeneratingPoster = false;
    console.error('海报生成失败:', error);
    myFn.showToast('海报生成失败，请重试');
  }

  /**
   * 绘制海报内容
   */
  drawPosterContent(ctx, width, height, canvas) {
    // 创建海报专用的文本渲染器
    const posterTextRenderer = new TextRenderer(ctx, this.screenAdapter);

    // 绘制背景
    this.drawPosterBackground(ctx, width, height);

    // 绘制用户信息
    this.drawPosterUserInfo(ctx, posterTextRenderer);

    // 绘制统计数据
    this.drawPosterStats(ctx, posterTextRenderer);

    // 绘制分析数据
    this.drawPosterAnalysis(ctx, posterTextRenderer);

    // 绘制建议
    this.drawPosterSuggestion(ctx, posterTextRenderer);
  }

  /**
   * 绘制海报背景
   */
  drawPosterBackground(ctx, width, height) {
    // 横屏个人页面背景
    const shareBg = this.resourceManager.getImage('shareBg');
    if (shareBg) {
      ctx.drawImage(shareBg, 0, 0, width, height);
    }

    // 绘制底部图标
    const shareBottomIcon = this.resourceManager.getImage('shareBottomIcon');
    if (shareBottomIcon) {
      ctx.drawImage(shareBottomIcon, 0, 1118, 750, 506);
    }
  }

  /**
   * 绘制海报用户信息
   */
  drawPosterUserInfo(ctx, textRenderer) {
    const userData = this.getUserData();
    const { AVATAR, USERNAME, USER_ID } = UI_CONSTANTS.POSITIONS.POSTER;

    // 绘制头像
    this.drawAvatar(AVATAR.X, AVATAR.Y, AVATAR.SIZE, AVATAR.SIZE, ctx);

    // 绘制用户名
    textRenderer.drawText(
      userData.user_name,
      USERNAME.X,
      USERNAME.Y,
      `${UI_CONSTANTS.FONT_SIZES.POSTER_USERNAME}px ${textRenderer.systemFont}`,
      UI_CONSTANTS.COLORS.WHITE,
      'left',
      'top'
    );

    // 绘制用户ID
    textRenderer.drawText(
      `ID:${userData.ID}`,
      USER_ID.X,
      USER_ID.Y,
      `${UI_CONSTANTS.FONT_SIZES.POSTER_USER_ID}px ${textRenderer.systemFont}`,
      UI_CONSTANTS.COLORS.WHITE,
      'left',
      'top'
    );
  }

  /**
   * 绘制海报统计数据
   */
  drawPosterStats(ctx, textRenderer) {
    if (!this.userData.userBattle) return;

    // 绘制统计标题背景
    this.drawSectionBackground(ctx, 92, 242, 496, 44);

    // 绘制统计标题
    textRenderer.drawText(
      '统计',
      UI_CONSTANTS.POSITIONS.POSTER.STATS_TITLE.X,
      UI_CONSTANTS.POSITIONS.POSTER.STATS_TITLE.Y,
      `${UI_CONSTANTS.FONT_SIZES.POSTER_TITLE}px ${textRenderer.systemFont}`,
      UI_CONSTANTS.COLORS.LIGHT_BLUE,
      'left',
      'top'
    );

    // 绘制统计项
    const { STATS_START, STATS_LABEL_X, STATS_VALUE_X } = UI_CONSTANTS.POSITIONS.POSTER;
    const lineHeight = UI_CONSTANTS.SIZES.POSTER_LINE_HEIGHT;

    UI_CONSTANTS.STATS_ITEMS.forEach((item, index) => {
      const y = STATS_START.Y + index * lineHeight;

      // 标签
      textRenderer.drawText(
        item.label,
        STATS_LABEL_X,
        y,
        `${UI_CONSTANTS.FONT_SIZES.POSTER_TEXT}px ${textRenderer.systemFont}`,
        UI_CONSTANTS.COLORS.WHITE,
        'left',
        'top'
      );

      // 值
      let value = this.userData.userBattle[item.key];
      if (item.format && value !== undefined && value !== null) {
        value = myFn.formatNumberManually(value);
      }

      textRenderer.drawText(
        value || '--',
        STATS_VALUE_X,
        y,
        `${UI_CONSTANTS.FONT_SIZES.POSTER_TEXT}px ${textRenderer.systemFont}`,
        UI_CONSTANTS.COLORS.WHITE,
        'right',
        'top'
      );
    });
  }

  /**
   * 绘制海报分析数据
   */
  drawPosterAnalysis(ctx, textRenderer) {
    if (!this.userData.userBattle) return;

    // 绘制分析标题背景
    this.drawSectionBackground(ctx, 92, 675, 496, 44);

    // 绘制分析标题
    textRenderer.drawText(
      '分析',
      UI_CONSTANTS.POSITIONS.POSTER.ANALYSIS_TITLE.X,
      UI_CONSTANTS.POSITIONS.POSTER.ANALYSIS_TITLE.Y,
      `${UI_CONSTANTS.FONT_SIZES.POSTER_TITLE}px ${textRenderer.systemFont}`,
      UI_CONSTANTS.COLORS.LIGHT_BLUE,
      'left',
      'top'
    );

    // 绘制表头
    const { ANALYSIS_START, ANALYSIS_COL1, ANALYSIS_COL2, ANALYSIS_COL3 } = UI_CONSTANTS.POSITIONS.POSTER;

    textRenderer.drawText(
      '指标',
      ANALYSIS_COL1,
      ANALYSIS_START.Y,
      `${UI_CONSTANTS.FONT_SIZES.POSTER_TEXT}px ${textRenderer.systemFont}`,
      UI_CONSTANTS.COLORS.LIGHT_BLUE,
      'left',
      'top'
    );

    textRenderer.drawText(
      '数值',
      ANALYSIS_COL2,
      ANALYSIS_START.Y,
      `${UI_CONSTANTS.FONT_SIZES.POSTER_TEXT}px ${textRenderer.systemFont}`,
      UI_CONSTANTS.COLORS.LIGHT_BLUE,
      'left',
      'top'
    );

    textRenderer.drawText(
      '参考值',
      ANALYSIS_COL3,
      ANALYSIS_START.Y,
      `${UI_CONSTANTS.FONT_SIZES.POSTER_TEXT}px ${textRenderer.systemFont}`,
      UI_CONSTANTS.COLORS.LIGHT_BLUE,
      'right',
      'top'
    );

    // 绘制分析项
    const lineHeight = UI_CONSTANTS.SIZES.POSTER_LINE_HEIGHT;

    UI_CONSTANTS.POSTER_ANALYSIS_ITEMS.forEach((item, index) => {
      const y = ANALYSIS_START.Y + (index + 1) * lineHeight + 20;

      // 指标名称
      textRenderer.drawText(
        item.label,
        ANALYSIS_COL1,
        y,
        `${UI_CONSTANTS.FONT_SIZES.POSTER_TEXT}px ${textRenderer.systemFont}`,
        UI_CONSTANTS.COLORS.WHITE,
        'left',
        'top'
      );

      // 数值
      let value = this.userData.userBattle[item.key];
      if (value !== undefined && value !== null) {
        value = value + (item.suffix || '');
      } else {
        value = '--';
      }

      textRenderer.drawText(
        value,
        ANALYSIS_COL2,
        y,
        `${UI_CONSTANTS.FONT_SIZES.POSTER_TEXT}px ${textRenderer.systemFont}`,
        UI_CONSTANTS.COLORS.WHITE,
        'left',
        'top'
      );

      // 参考值
      const referenceValue = UI_CONSTANTS.REFERENCE_VALUES[item.key] || '--';
      textRenderer.drawText(
        referenceValue,
        ANALYSIS_COL3,
        y,
        `${UI_CONSTANTS.FONT_SIZES.POSTER_TEXT}px ${textRenderer.systemFont}`,
        UI_CONSTANTS.COLORS.WHITE,
        'right',
        'top'
      );
    });
  }

  /**
   * 绘制海报建议
   */
  drawPosterSuggestion(ctx, textRenderer) {
    const { SUGGESTION } = UI_CONSTANTS.POSITIONS.POSTER;

    textRenderer.drawText(
      '建议：您的胜率和盈亏比太低，还不适合实战，先',
      SUGGESTION.X,
      SUGGESTION.Y,
      `${UI_CONSTANTS.FONT_SIZES.POSTER_TEXT}px ${textRenderer.systemFont}`,
      UI_CONSTANTS.COLORS.WHITE,
      'left',
      'top'
    );

    textRenderer.drawText(
      '加强投资技能学习吧。',
      SUGGESTION.X,
      SUGGESTION.Y + 40,
      `${UI_CONSTANTS.FONT_SIZES.POSTER_TEXT}px ${textRenderer.systemFont}`,
      UI_CONSTANTS.COLORS.WHITE,
      'left',
      'top'
    );
  }

  /**
   * 绘制区块背景
   */
  drawSectionBackground(ctx, x, y, width, height) {
    const gradient = ctx.createLinearGradient(x, y, x + width, y);
    gradient.addColorStop(0, '#373759');
    gradient.addColorStop(1, 'rgba(55,55,89,0)');
    ctx.fillStyle = gradient;
    ctx.fillRect(x, y, width, height);
  }
}
